<template>
  <div class="setting-container">
    <el-tabs tab-position="left" class="setting-tabs">
      <el-tab-pane label="指定成员管理">
        <designated-publish />
      </el-tab-pane>
      <el-tab-pane label="公开发布">
        <public-publish />
      </el-tab-pane>
      <el-tab-pane label="公开查询">
        <public-query />
      </el-tab-pane>
      <el-tab-pane label="短信发送">
        <sms-sending />
      </el-tab-pane>
    </el-tabs>
  </div>
</template>
<script>
import publicPublish from './public'
import PublicQuery from './PublicQuery'
import smsSending from './smsSending'
import designatedPublish from './designated'

export default {
  name: 'PublishTabs',
  components: {
    designatedPublish,
    publicPublish,
    PublicQuery,
    smsSending
  },
  data() {
    return {}
  }
}
</script>

<style lang="scss" scoped>
.setting-container {
  width: 100%;
  display: flex;
  justify-content: center;

  .setting-tabs {
    margin-top: 20px;
    width: 900px;
    min-height: 500px;
  }
}

::v-deep.el-tabs--left .el-tabs__nav-wrap.is-left::after {
  width: 0;
}

::v-deep.el-tabs--left .el-tabs__nav.is-left, .el-tabs--left .el-tabs__nav.is-right, .el-tabs--right .el-tabs__nav.is-left, .el-tabs--right .el-tabs__nav.is-right {
  background-color: #FFFFFF !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04) !important;
}

</style>
